<template>
	<view>
		<u-sticky>
			<u-tabs-swiper ref="uTabs" :list="list" :current="current" @change="tabsChange" name="name" :is-scroll="true"
			 active-color="#ffda33" :bold="true"></u-tabs-swiper>
		</u-sticky>
		<listcard></listcard>
	</view>
</template>

<script>
	import {mapActions} from 'vuex';
	import listcard from './listcard.vue';
	export default {
		props: {
			list: {
				type: Array,
				default () {
					return []
				}
			}
		},
		components: {
			listcard
		},
		data() {
			return {
				current: 0, // tabs组件的current值，表示当前活动的tab选项
				scrollTop:0,
			};
		},
		mounted() {
			this.getList();
		},
		methods: {
			...mapActions('home',['getList','refreshList']),
			// tabs通知swiper切换
			tabsChange(index) {
				this.current = index;
				if(index>0){
					this.$emit('change',this.current);
					this.refreshList(this.list[index].name);
					return;
				}else{
					this.refreshList();
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
.u-flex {
	justify-content: center;
}
</style>
